<?php
session_start();
if(!isset($_SESSION['logged-in'])){
  header("location:bootstrapDemo.php");

  
}
?>

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Bootstrap, from Twitter</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta name="description" content="">
	<meta name="author" content="">

	<!-- Le styles -->
	<link href="css/bootstrap.css" rel="stylesheet">
	<style type="text/css">
	body {
		padding-top: 60px;
		padding-bottom: 40px;
	}
	.sidebar-nav {
		padding: 9px 0;
	}
	</style>
	<link href="css/bootstrap-responsive.css" rel="stylesheet">

	<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
      <![endif]-->

      <!-- Fav and touch icons -->
      <link rel="apple-touch-icon-precomposed" sizes="144x144" href="ico/apple-touch-icon-144-precomposed.png">
      <link rel="apple-touch-icon-precomposed" sizes="114x114" href="ico/apple-touch-icon-114-precomposed.png">
      <link rel="apple-touch-icon-precomposed" sizes="72x72" href="ico/apple-touch-icon-72-precomposed.png">
      <link rel="apple-touch-icon-precomposed" href="ico/apple-touch-icon-57-precomposed.png">
      <link rel="shortcut icon" href="ico/favicon.png">
      
    </head>

    <body>

     <div class="navbar navbar-inverse navbar-fixed-top">
      <div class="navbar-inner">
       <div class="container-fluid">
        <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </a>
       <a class="brand" href="#">Project name</a>
       <div class="nav-collapse collapse">
         <p class="navbar-text pull-right">
          Logged in as <a href="#" class="navbar-link"><?php echo $_SESSION['username'];?></a>
        </p>
        <ul class="nav">
          <li class="active"><a href="bootstrapDemo2.php">Home</a></li>
          <li><a href="#about">About</a></li>
          <li><a href="#contact">Contact</a></li>
        </ul>
      </div><!--/.nav-collapse -->
    </div>
  </div>
</div>

<div class="container-fluid">
  <div class="row-fluid">
   <div class="span3">
    <div class="well sidebar-nav">
     <ul class="nav nav-list">
      <li class="nav-header">Sidebar</li>
      <li><a href="viewEmployee.php">Employees</a></li>
      <li><a href="viewShift.php">Employee Shifts</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li class="nav-header">Sidebar</li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li class="nav-header">Sidebar</li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
      <li><a href="#">Link</a></li>
    </ul>
  </div><!--/.well -->
</div><!--/span-->
<div class="span9">



  <h2>Employees</h2>
  <div class="accordion" id="accordion2">
   <?php
   include"phpLibrary.php";
   showEmployeeInfo($_SESSION['username'],$_SESSION['password']);
   ?>
   <div class='accordion-group' >
    <div class='accordion-heading' >
     <div class="row-fluid">
      <a class='accordion-toggle span3' data-toggle='collapse' data-parent='#accordion2' href='#collapsetest'>Test Area</a>
      <a href="#modalTest" role="button" class="btn-small accordion-toggle span2" data-toggle="modal">View Shift</a>

    </div>
  </div>
  <div id='collapsetest' class='accordion-body collapse'>
   <div class='accordion-inner'>
    <div class='row-fluid'>Test tes test<!-- Button to trigger modal -->
     <!-- Modal -->
     <div id="modalTest" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
      <div class="modal-header">
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
       <h3 id="myModalLabel">Modal header</h3>
     </div>
     <div class="modal-body">
       <p>One fine body…</p>
     </div>
     <div class="modal-footer">
       <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
       <button class="btn btn-primary">Save changes</button>
     </div>
   </div>
 </div>
</div>
</div>
  					</div><!--/span
  				</div><!--/row-->
  				<hr>




  			</div><!--/.fluid-container-->
  			<footer id="footer">
  				<div class="container">
  					<p class="text-center muted credit">&copy; SevenBits, Company 2012</p>
  				</div>
  			</footer>



    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery-1.7.2.min.js"></script>
    <script src="js/bootstrap-transition.js"></script>
    <script src="js/bootstrap-alert.js"></script>
    <script src="js/bootstrap-modal.js"></script>
    <script src="js/bootstrap-dropdown.js"></script>
    <script src="js/bootstrap-scrollspy.js"></script>
    <script src="js/bootstrap-tab.js"></script>
    <script src="js/bootstrap-tooltip.js"></script>
    <script src="js/bootstrap-popover.js"></script>
    <script src="js/bootstrap-button.js"></script>
    <script src="js/bootstrap-collapse.js"></script>
    <script src="js/bootstrap-carousel.js"></script>
    <script src="js/bootstrap-typeahead.js"></script>

  </body>
  </html>